<template>
	<view class="apply">
		<u-navbar>
			<view slot="left" class="align-center">
				<image @click="$tools.back()" src="@/static/login/back3.png" style="width: 36rpx; height: 36rpx"></image>
			</view>
			<view slot="center">
				<view style="font-weight: 600; font-size: 36rpx; color: #333333">报名岗位</view>
			</view>
		</u-navbar>
		<view style="margin-bottom: 34rpx">
			<view style="font-weight: 600; font-size: 40rpx; color: #333333; margin-bottom: 24rpx">{{ userInfo.name }}</view>
			<view style="font-weight: 400; font-size: 28rpx; color: #333333; margin-bottom: 26rpx">{{ userInfo.sex == 1 ? '男' : '女' }} ｜ {{ userInfo.age }}岁</view>
			<!-- <view style="font-weight: 400; font-size: 28rpx; color: #333333; margin-bottom: 26rpx">应聘单位：北京宝格丽酒店</view>
			<view style="font-weight: 400; font-size: 28rpx; color: #333333; margin-bottom: 26rpx">应聘岗位：酒店大堂经理</view> -->
			<view style="border-bottom: 1rpx solid #eeeeee"></view>
		</view>
		<view>
      <view @click="show1 = true" style="border-bottom: 1rpx solid #eeeeee; margin-bottom: 30rpx">
        <view style="font-weight: 300; font-size: 24rpx; color: #333333">民族</view>
        <view class="flex-between1" style="margin-bottom: 14rpx; padding: 10rpx 0 30rpx 0">
          <text v-if="!userInfo.nation" style="font-size: 28rpx; color: #333333">请选择民族</text>
          <text v-else style="font-size: 28rpx; color: #333333">{{  userInfo.nation }}</text>
          <image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx"></image>
        </view>
        <u-picker :show="show1" :columns="columns" @confirm="confirm" @cancel="show1 = false"></u-picker>
      </view>
			<!-- <view style="margin-bottom: 30rpx">
				<view class="label">最高学历</view>
				<view class="flex-between1" style="padding: 20rpx 0; border-bottom: 1rpx solid #eeeeee">
					<text style="font-weight: 500; font-size: 28rpx; color: #333333">{{ userInfo.culture }}</text>
					<u-icon name="arrow-right" size="24" :bold="true"></u-icon>
				</view>
			</view> -->
      <view @click="show2 = true" style="border-bottom: 1rpx solid #eeeeee; margin-bottom: 30rpx">
        <view style="font-weight: 300; font-size: 24rpx; color: #333333">婚姻状况</view>
        <view class="flex-between1" style="margin-bottom: 14rpx; padding: 10rpx 0 30rpx 0">
          <text v-if="!userInfo.marital" style="font-size: 28rpx; color: #333333">请选择婚姻状况</text>
          <text v-else style="font-size: 28rpx; color: #333333">{{  userInfo.marital }}</text>
          <image src="@/static/mine/mineright.png" style="width: 16rpx; height: 26rpx"></image>
        </view>
        <u-picker :show="show2" :columns="columns2" @confirm="confirm2" @cancel="show2 = false"></u-picker>
      </view>
			<view style="margin-bottom: 30rpx">
				<view class="label">现住址</view>
				<view class="flex-between1" style="padding: 20rpx 0; border-bottom: 1rpx solid #eeeeee">
<!--					<text style="font-weight: 500; font-size: 28rpx; color: #333333">{{ userInfo.address }}</text>-->
          <input class="label1" v-model="userInfo.address" type="number" placeholder="请输入详细地址" />
<!--					<u-icon name="arrow-right" size="24" :bold="true"></u-icon>-->
				</view>
			</view>
			<view style="margin-bottom: 30rpx">
				<view class="label">联系电话</view>
				<view class="flex-between1" style="padding: 20rpx 0; border-bottom: 1rpx solid #eeeeee">
					<text style="font-weight: 500; font-size: 28rpx; color: #333333">{{ userInfo.phone }}</text>
					<u-icon name="arrow-right" size="24" :bold="true"></u-icon>
				</view>
			</view>
		</view>
		<view class="flex-center1">
			<view
				@click="apply()"
				class="flex-center1"
				style="width: 640rpx; height: 96rpx; background: #1365f9; border-radius: 16rpx; font-weight: 600; font-size: 32rpx; color: #ffffff"
			>
				报名
			</view>
		</view>
		<u-popup :show="show" @close="close" @open="open" mode="center" round="20" :closeOnClickOverlay="false">
			<view class="pop" style="width: 560rpx; height: 496rpx; padding-top: 64rpx; background: url('../../static/index/bm.png') no-repeat; background-size: 100% 100%">
				<view class="flex-center1" style="margin-bottom: 30rpx">
					<image src="@/static/index/bm1.png" style="width: 168rpx; height: 152rpx"></image>
				</view>
				<view style="font-size: 32rpx; color: #333333; text-align: center; margin-bottom: 30rpx">报名成功</view>
				<view class="flex-center1">
					<view
						@click="close"
						class="flex-center1"
						style="width: 480rpx; height: 88rpx; background: rgba(19, 101, 249, 0.1); border-radius: 8rpx; font-weight: 400; font-size: 28rpx; color: #1365f9"
					>
						返回
					</view>
				</view>
			</view>
		</u-popup>
	</view>
</template>

<script>
export default {
	data() {
		return {
      columns: [['汉族','壮族','满族','维吾尔族','回族','苗族','彝族','藏族','蒙古族','布依族','侗族','瑶族','白族','哈尼族',
        '朝鲜族','黎族','哈萨克族','傣族','东乡族','傈僳族','畲族','仡佬族','拉祜族','水族','佤族','纳西族','羌族','土族','仫佬族',
        '柯尔克孜族','锡伯族','撒拉族','景颇族','达斡尔族','布朗族','毛南族','塔吉克族','普米族','阿昌族','怒族','鄂温克族','京族','基诺族',
        '保安族','德昂族','俄罗斯族','裕固族','乌孜别克族','门巴族','鄂伦春族','独龙族','赫哲族','珞巴族','塔塔尔族','高山族']],
      columns2: [['已婚','未婚']],
      show: false,
      show1: false,
      show2: false,
			id: '',
			userInfo: {}
		};
	},
	onLoad(option) {
		this.id = option.value;
		this.init();
	},
	methods: {
		init() {
			this.$request('front/user/userInfo').then((res) => {
				console.log(res, '个人信息');
				this.userInfo = res.obj.userInfo;
			});
		},
		open() {
			// console.log('open');
		},
		close() {
			this.show = false;
			console.log('close');
			this.$tools.navigite('/pages/index/index');
		},
		apply() {
			this.$request('front/user/signPost', {
				id: this.id
			}).then((res) => {
				console.log(res, '详情');
				if (res.code == 0) {
					this.show = true;
				}
			});
		},
    confirm(e) {
      console.log('confirm', e);
      this.userInfo.nation = e.value[0];
      this.show1 = false;
    },
    confirm2(e) {
      console.log('confirm', e);
      this.userInfo.marital = e.value[0];
      this.show2 = false;
    },
	}
};
</script>

<style lang="less" scoped>
.apply {
	padding: 180rpx 34rpx 50rpx;
	.label {
		font-weight: 300;
		font-size: 24rpx;
		color: #333333;
	}
	.pop {
	}
}
.label1 {
  font-weight: 500;
  font-size: 28rpx;
  color: #333333;
}
.btn1 {
  padding: 8rpx 20rpx;
  background: #f8f8f8;
  border-radius: 8rpx;
  font-weight: 400;
  font-size: 24rpx;
  color: #666666;
  margin-right: 20rpx;
}
.btn2 {
  background: #1365f9;
  font-weight: 600;
  color: #ffffff;
}
</style>
